<!--  -->
<template>
  <div class="">
    <div class="item">
      <div class="title">模板1</div>
      <div class="temp">
        <img
          class="img"
          src="https://hb-saas.obs.cn-south-1.myhuaweicloud.com/obs/20230724/5b51530c903741e284841b3b437fa3df.png"
          alt=""
        />
        <div class="action">
          <a-button
            v-has="'web:miniProgramConfig'"
            type="link"
            icon="setting"
            @click="$router.push('/web/miniProgramConfig')"
            >编辑</a-button
          >
          <!-- <a-button type="link" icon="share-alt">预览</a-button> -->
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  components: {},
  data() {
    return {}
  },
  computed: {},
  watch: {},
  methods: {},
  created() {},
  mounted() {},
}
</script>
<style scoped lang="less">
.item {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 250px;

  .temp {
    width: 250px;
    height: 570px;
    border-radius: 20px;
    box-shadow: 0 0 10px 10px rgba(0, 0, 0, 0.1);
    padding: 10px 15px;
    margin-top: 15px;

    .img {
      width: 220px;
      height: 500px;
    }

    .action {
      display: flex;
      justify-content: space-between;
      margin-top: 15px;
    }
  }

  .btn {
    margin-top: 15px;
  }
}
</style>